<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>Vmall后台管理</title>
		<link rel="stylesheet" href="css/gzh/admin.css" />
		<link rel="stylesheet" href="css/new.css" />
		<link rel="stylesheet" href="css/font-awesome.min.css" />
		<link rel="stylesheet" href="css/font-awesome.css" />
		<link rel="stylesheet" href="css/adminSystem.css" />
		<script src="lib/vue.js"></script>
		<script src="js/gzh/jquery-3.3.1.min.js"></script>
		<script src="lib/bootstrap.min.js"></script>
		<style type="text/css">
.itemInfo>td{
	border-top: 1px solid #f4f4f4;
	    padding: 8px;
    line-height: 1.42857143;
    vertical-align: top;
    border-top: 1px solid #ddd;
}
.img-thumbnail {
    display: inline-block;
    max-width: 100%;
    height: auto;
    padding: 4px;
    line-height: 1.42857143;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    -webkit-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}
th:nth-child(1){
	width:30px;
}
td:nth-child(1){
	width:30px;
}
td:nth-child(2){
	width:267px;
}
td:nth-child(3){
	width:163px;
}
td:nth-child(4){
	width:216px;
}
td:nth-child(5){
	width:164px;
}
td:nth-child(6){
	width:164px;
}
td:nth-child(7){
	width:164px;
}
td:nth-child(8){
	width:164px;
}
td:nth-child(9){
	width:164px;
}
td:nth-child(10){
	width:164px;
}
#pageSelect {
	max-width: 1266px;
	height: 100px;
	padding: 30px 30px;
}

#selectContent {
	float: right;
	margin: auto 20px;
	height: 40px;
}
#selectContent .disablebtn{
	disabled:true;
	pointer-events: none;
	opcity:0.5;
	color:gray;
}
#selectContent .option {
	width: 30px;
	height: 30px;
	line-height: 30px;
	border: 1px solid gainsboro;
	text-align: center;
	float: left;
	margin: 5px;
	color: #666;
}

#selectContent .option:hover {
	background: #3A3A3A;
	color: white;
}
		</style>
	</head>

	<body class="fixed skin-blue">
		<div class="wrapper" style="height: auto; min-height: 100%;">
			<header class="main-header">
				<div class="logo">
					<span class="logo-lg"><b>VMALL</b>后台管理</span>
				</div>
				<nav class="navbar navbar-static-top">
					<a href="#" class="sidebar-toggle" data-toggle="push-menu" role="button">
						<span class="sr-only glyphicon glyphicon-th-list"></span>
					</a>

					<!--顶部菜单 开始-->
					<div id="menu" class="navbar-custom-menu">
						<ul class="nav navbar-nav" name="topMenu">
							<li class="active">
								<a hidefocus="true" href="/goods/goods_list">商品</a>
							</li>
							<li>
								<a hidefocus="true" href="/member/member_list">会员</a>
							</li>
							<li>
								<a hidefocus="true" href="/order/order_list">订单</a>
							</li>
							<li>
								<a hidefocus="true" href="/market/pro_rule_list">营销</a>
							</li>
							<li>
								<a hidefocus="true" href="/market/user_reg">统计</a>
							</li>
							<li >
								<a hidefocus="true" href="/system/default">系统</a>
							</li>
							<li>
								<a hidefocus="true" href="/tools/db_bak">工具</a>
							</li>
							<li>
								<a hidefocus="true" href="/plugins/plugin_list">插件</a>
							</li>
							<li>
								<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
							</li>
						</ul>
					</div>
					<!--顶部菜单 结束-->
				</nav>
			</header>

			<aside id="admin_left" class="main-sidebar">
				<section class="sidebar" style="height: auto;">
					<div class="user-panel">
						<div class="pull-left image">

							<i class="glyphicon glyphicon-user"></i>
						</div>
						<div class="pull-left info">
							<p>admin</p>
							<a href="#">超级管理员</a>
						</div>
					</div>

					<ul class="sidebar-menu tree" data-widget="tree">
						<li class="header">商品模块菜单</li>
						<li class="treeview menu-open">
							<a href="#collapseOne" data-toggle="collapse" data-parent="#accordion">
								<i class="fa fa-home" name="ico" menu="商品管理"></i>
								<span>商品管理</span>
								<span class="pull-right-container">
									<i class="glyphicon glyphicon-chevron-down pull-right"></i>
								</span>
							</a>
							<ul id="collapseOne" class="treeview-menu" name="leftMenu" style="display: block;">
								<li class="active">
									<a href="http://localhost:8080/vmall/adminGoodList"><i class="fa fa-circle-o"></i>商品列表</a>
								</li>
								<li class="">
									<a href="http://localhost:8080/vmall/adminGoodList?method=addGoods" id="addGoods" class="addGoods"><i class="fa fa-circle-o"></i>添加商品</a>
								</li>
							</ul>
						</li>
						<li class="treeview">
							<a href="#collapseTwo" data-toggle="collapse" data-parent="#accordion">
								<i class="fa fa-wrench" name="ico" menu="商品分类"></i>
								<span>商品分类</span>
								<span class="pull-right-container">
									<i class="glyphicon glyphicon-chevron-left pull-right"></i>
								</span>
							</a>
							<ul id="collapseTwo" class="treeview-menu" name="leftMenu">
								<li>
									<a href="/system/conf_base"><i class="fa fa-circle-o"></i>分类列表</a>
								</li>
								<li>
									<a href="/system/conf_guide"><i class="fa fa-circle-o"></i>添加分类</a>
								</li>
							</ul>
						</li>
						<li class="treeview">
							<a href="#collapseFour" data-toggle="collapse" data-parent="#accordion">
								<i class="fa fa-share-alt" name="ico" menu="搜索"></i>
								<span>搜索</span>
								<span class="pull-right-container">
									<i class="glyphicon glyphicon-chevron-left pull-right"></i>
								</span>
							</a>
							<ul id="collapseFour" class="treeview-menu" name="leftMenu">
								<li>
									<a href="/system/oauth_list"><i class="fa fa-circle-o"></i>关键字搜索</a>
								</li>
								<li>
									<a href="/system/hsms"><i class="fa fa-circle-o"></i>-----</a>
								</li>
							</ul>
						</li>
						<li class="treeview">
							<a href="#collapseFive" data-toggle="collapse" data-parent="#accordion">
								<i class="fa fa-truck" name="ico" menu="配送管理"></i>
								<span>配送管理</span>
								<span class="pull-right-container">
									<i class="glyphicon glyphicon-chevron-left pull-right"></i>
								</span>
							</a>
							<ul id="collapseFive" class="treeview-menu" name="leftMenu">
								<li>
									<a href="/system/delivery"><i class="fa fa-circle-o"></i>配送方式</a>
								</li>
								<li>
									<a href="/system/freight_list"><i class="fa fa-circle-o"></i>物流公司</a>
								</li>
								<li>
									<a href="/system/takeself_list"><i class="fa fa-circle-o"></i>自提点列表</a>
								</li>
								<li>
									<a href="/system/takeself_edit"><i class="fa fa-circle-o"></i>添加自提点</a>
								</li>
							</ul>
						</li>

					</ul>
				</section>
			</aside>
			<div id="admin_right" class="content-wrapper" style="min-height: 507px;">
				<div class="breadcrumbs" id="breadcrumbs">
					<ul class="breadcrumb">
						<li>
							<i class="home-icon fa fa-home"></i>
							<a href="#">商品</a>
						</li>
						<li>
							<a href="#">商品管理</a>
						</li>
						<li class="active">商品列表</li>
					</ul>
				</div>
				<div class="content" style="min-height:880px">
					<caption id="aa">
					
						<a href="http://localhost:8080/vmall/adminGoodList?method=addGoods" class="btn btn-primary addGoods" id="addGoods"><i class="fa fa-plus"></i>添加</a>
						<button type="button" class="btn btn-primary" id="checkAll" data='true'><i class="fa fa-check"></i>全选</button>
						<div class="btn-group">
							<button type="button" class="btn btn-primary"><i class="fa fa-cogs"></i>批量操作</button>
							<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
						      <span class="caret"></span>
						      <span class="sr-only">切换下拉菜单</span></button>
							<ul class="dropdown-menu" role="menu">
								<li>
									<a href="#" id="onsale">上架</a>
								</li>
								<li>
									<a href="#" id="downsale">下架</a>
								</li>
								<li>
									<a href="#" id="delete">删除</a>
								</li>
								<li class="divider"></li>
								<li>
									<a href="#">导出Excel</a>
								</li>
							</ul>
						</div>
						<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#edit" id="goodsEdit"><i class="fa fa-edit "></i>快速编辑</button>
						<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#search"><i class="fa fa-search "></i>检索</button>
					</caption>
					
					<p id="searchTitle">商品总计：{{listCount}}件</p>
					<table class="table table-list">
						<tr>
							<th></th>
							<th>商品名称</th>
							<th>分类</th>
							<th>销售价</th>
							<th>库存</th>
							<th>成本</th>
							<th>状态</th>
							<th>折扣</th>
							<th>运费</th>
							<th>操作</th>
						</tr>
						</table>
					
					
					<div  id="searchResult">
						<table class="table table-list">
						<tbody>
						<div id="itemList">
							<item v-for="item in items" v-bind:key="item.goodsid" v-bind:item="item"></item>
						</div>
						</tbody>
						</table>
							
						</div>
					</div>
					
				</div>
			</div>
		</div>
		<script type="text/javascript">
			$(function() {
				$('#collapseone').collapse('show')
			});
			$(function() {
				$('#collapseTwo').collapse('hide')
			});
			$(function() {
				$('#collapseThree').collapse('hide')
			});
			$(function() {
				$('#collapseFour').collapse('hide')
			});
			$(function() {
				$('#collapseFive').collapse('hide')
			});
			$(function() {
				$('#collapseSix').collapse('hide')
			});
			$(function() {
				$('#collapseSeven').collapse('hide')
			});
			$(function(){
				$("#checkAll").click(function(){
					if ($(this).attr("data")=="true") {
						$(".itemInfo :checkbox").prop("checked", true);
						$(this).attr("data",false);
					}
					else if($(this).attr("data")=="false"){
						$(".itemInfo :checkbox").prop("checked", false);	
						$(this).attr("data",true);
					}
					
				})
			})
			
		</script>
		<div class="modal fade" id="edit" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog" style="width: 650px;">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×            </button>
						<h4 class="modal-title" id="myModalLabel">
		               商品编辑          </h4>
					</div>
					<div class="modal-body" style="overflow: hidden;">
						<div class="container1">
							<iframe src="http://localhost:8080/vmall/adminGoodList?method=goodsEdit" name="iframe-edit" frameborder="0" allowtransparency="true" style="width: 620px; height: 350px; border: 0px none;scrolling:no"></iframe>

						</div>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭            </button>
						<button type="button" class="btn btn-primary" id="submit">
		               提交更改            </button>
					</div>
				</div>
				<!-- /.modal-content -->
			</div>
			<!-- /.modal-dialog -->
		</div>
		<!-- /.modal -->

		<div class="modal fade" id="search" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog" style="width: 650px;">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×            </button>
						<h4 class="modal-title" id="myModalLabel">
		               商品检索          </h4>
					</div>
					<div class="modal-body" style="overflow: hidden;">
						<div class="container1">
							<iframe src="http://localhost:8080/vmall/adminGoodList?method=goodsSearch" name="iframe-search" frameborder="0" allowtransparency="true" style="width: 620px; height: 350px; border: 0px none;"></iframe>

						</div>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭            </button>
						<button type="button" class="btn btn-primary" id="sbsearch">
		               提交            </button>
					</div>
				</div>
				<!-- /.modal-content -->
			</div>
			<!-- /.modal-dialog -->
		</div>
		<!-- /.modal -->
			<div class="modal fade" id="this" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog" style="display:block; width: 650px;">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×            </button>
						<h4 class="modal-title" id="myModalLabel">
		               消息          </h4>
					</div>
					<div class="modal-body" style="overflow: hidden;">
						<div class="container1">
							是否删除？
						</div>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭            </button>
						<button type="button" class="btn btn-primary" id="trueDelete">
		              删除            </button>
					</div>
				</div>
				<!-- /.modal-content -->
			</div>
			<!-- /.modal-dialog -->
		</div>
		<!-- /.modal -->
<script type="text/javascript">
	//将商品列表的数组型字符串转为json数组型对象
	var jsonstr='${requestScope.items}';
	console.log("jsonstr:"+jsonstr);
	var itemList=$.parseJSON(jsonstr);
	console.log(itemList);
	var listCount='${requestScope.listCount}';
	console.log("listCount:"+listCount);
	var pagesize=2;
	var pages=Math.ceil(listCount/2);//总页数
	console.log("pages:"+pages);
	//当前页
	var currentPage='${requestScope.currentPage}';
	console.log("currentPage:"+currentPage);
	var searchTitle=new Vue({
		el:"#searchTitle",
		data:{
			listCount:listCount,
		}
	});
	
	//商品列表
	Vue.component('item', {
		props: ['item'],
		template:`
		<tr class="itemInfo">
			
			<td id="td1"><input name="id[]" type="checkbox" id="id[]" class="chk" v-bind:value="item.goodsid"></td>
			<td>
				<img v-bind:src='item.titleImg' width="60px" height="60px" class="pull-left img-thumbnail">
				<a href="#">{{item.name}}</a>
			</td>
			<td>
				{{item.classify1}}&nbsp{{item.classify2}}
			</td>
			<td>
				{{item.price}}
			</td>
			<td>
				<a href="#" title="库存" v-bind:id="'countText'+item.goodsid">{{item.count}}</a>
			</td>
			<td>
				<a href="#" title="成本" v-bind:id="'priceText'+item.goodsid">{{item.cost}}</a>
			</td>
			
			
			<td>
				{{item.ifonsale}}
			</td>
			<td>
				{{item.discount_price}}
			</td>
			<td>
				{{item.post_fee}}
			</td>
			
			<td>
				<a href="/goods/goods_edit/id/382/type/default"><i class="operator fa fa-edit"></i></a>
				<a id="deletethis" data-toggle="modal" data-target="#this" v-bind:value="item.goodsid"><i class="operator fa fa-close" v-bind:value="item.goodsid"></i><span style="color:white">{{item.goodsid}}</span></a>
	
			</td>
		</tr>	
		`
	});
	
	var item = new Vue({
		el: "#itemList",
		data: {
			items: itemList,
		},
	});
	
	
	//根据页数跳往相应的页数，fcid和scid以及排序方式为默认的
	function changePage(obj){
		var pageNum=$(obj).data("pagenum");
		location.href="adminGoodList?method=basefun&"
				+"&viewPage="+pageNum;
		
	}
		
	$(document).ready(function(){
		$(".addGoods").click(function(){
			location.href="adminGoodList?method=addGoods";
			
		});
		$("#onsale").click(function(){
			var str="";
			    var sel=document.getElementsByName("id[]");//获取checkbox的值
			    for( var i=0;i<sel.length;i++){
			        if(sel[i].checked==true){
				str+=sel[i].value+",";
			}
		}
			$.get("adminGoodList?method=onsale",{str:str},function(e){
    			if (e=="ok") {
    				alert("修改成功");
    				window.location.href="adminGoodList";
    			} 
    			else{
    				alert("请选择商品！");
    			}
    		});
		});
		$("#downsale").click(function(){
			var str="";
			    var sel=document.getElementsByName("id[]");//获取checkbox的值
			    for( var i=0;i<sel.length;i++){
			        if(sel[i].checked==true){
				str+=sel[i].value+",";
			}
		}
			$.get("adminGoodList?method=downsale",{str:str},function(e){
    			if (e=="ok") {
    				alert("修改成功");
    				window.location.href="adminGoodList";
    			} 
    			else{
    				alert("请选择商品！");
    			}
    		});
		});
		$("#delete").click(function(){
			var str="";
			    var sel=document.getElementsByName("id[]");//获取checkbox的值
			    for( var i=0;i<sel.length;i++){
			        if(sel[i].checked==true){
				str+=sel[i].value+",";
			}
		}
			$.get("adminGoodList?method=delete",{str:str},function(e){
    			if (e=="ok") {
    				alert("删除成功");
    				window.location.href="adminGoodList";
    			} 
    			else{
    				alert("请选择商品！");
    			}
    		});
		});
		$("#deletethis").click(function(){
			var goodsid= $(this).text();
			$("#trueDelete").click(function(){
			$.get("adminGoodList?method=delete",{str:goodsid},function(e){
    			if (e=="ok") {
    				alert("修改成功");
    				window.location.href="adminGoodList";
    			} 
    			else{
    				alert("登录失败");
    				}
    			});
			})
		})
		$("#goodsEdit").click(function(){
			var str="";
			    var sel=document.getElementsByName("id[]");//获取checkbox的值
			    for( var i=0;i<sel.length;i++){
			        if(sel[i].checked==true){
				str+=sel[i].value+",";
			}
			}
				if(str==""){
					alert("请选择商品！");
					$("#edit").attr("id","qqq");
				}
				else{
					$("#qqq").attr("id","edit");
				}
				
			
		})
		 $("#submit").click(function(){
			 var str="";
				    var sel=document.getElementsByName("id[]");//获取checkbox的值
				    for( var i=0;i<sel.length;i++){
				        if(sel[i].checked==true){
					str+=sel[i].value+",";
				}
				}
			var price="";
			var price1= $(window.frames["iframe-edit"].document).find(":radio[name='market_price_type']:checked").val();
			var price2= $(window.frames["iframe-edit"].document).find(":text[name='market_price']").val();
			var price3= $(window.frames["iframe-edit"].document).find("#market_price_unit").val();
			price=price1+","+price2+","+price3+",";
			
		 	var cost="";
			var cost1= $(window.frames["iframe-edit"].document).find(":radio[name='cost_price_type']:checked").val();
			var cost2= $(window.frames["iframe-edit"].document).find(":text[name='cost_price']").val();
			var cost3= $(window.frames["iframe-edit"].document).find("#cost_price_unit").val();
			cost=cost1+","+cost2+","+cost3+",";

		 	var sell="";
			var sell1= $(window.frames["iframe-edit"].document).find(":radio[name='sell_price_type']:checked").val();
			var sell2= $(window.frames["iframe-edit"].document).find(":text[name='sell_price']").val();
			var sell3= $(window.frames["iframe-edit"].document).find("#sell_price_unit").val();
			sell=sell1+","+sell2+","+sell3+",";

		 	var store="";
			var store1= $(window.frames["iframe-edit"].document).find(":radio[name='store_nums_type']:checked").val();
			var store2= $(window.frames["iframe-edit"].document).find(":text[name='store_nums']").val();
			var store3= $(window.frames["iframe-edit"].document).find("#store_nums_unit").val();
			store=store1+","+store2+","+store3+",";

		 	var exp="";
			var exp1= $(window.frames["iframe-edit"].document).find(":radio[name='exp_type']:checked").val();
			var exp2= $(window.frames["iframe-edit"].document).find(":text[name='exp']").val();
			var exp3= $(window.frames["iframe-edit"].document).find("#exp_unit").val();
			exp=exp1+","+exp2+","+exp3+",";
			$("#edit").modal("hide");
			
			$.get("adminGoodList?method=editGoods",{str:str,price:price,cost:cost,sell:sell,store:store,exp:exp},function(e){
    			if (e=="ok") {
    				alert("修改成功");
    				window.location.href="adminGoodList";
    			} 
    			else{
    				alert("登录失败");
    				}
    			});
			});
		 });
	
	//商品检索
	$("#sbsearch").click(function(){
		var type=$(window.frames["iframe-search"].document).find("input[name='search[type]']").val();
		var content=$(window.frames["iframe-search"].document).find(":text[name='search[content]']").val();
		var count=$(window.frames["iframe-search"].document).find("select[name='search[store_nums]']").val();
		var ifonsale=$(window.frames["iframe-search"].document).find("select[name='search[is_del]']").val();
		var laber=$(window.frames["iframe-search"].document).find("select[name='search[commend_id]']").val();
		var priceDown=$(window.frames["iframe-search"].document).find(":text[name='search[seller_price_down]']").val();
		var priceUp=$(window.frames["iframe-search"].document).find(":text[name='search[seller_price_up]']").val();
		/* var timeStart=$(window.frames["iframe-search"].document).find("input[name='search[create_time_start]']").val();
		var timeEnd=$(window.frames["iframe-search"].document).find("input[name='search[create_time_end]']").val(); */
		$.get("adminGoodList?method=searchGoods",{type:type,content:content,count:count,ifonsale:ifonsale,laber:laber,priceDown:priceDown,priceUp:priceUp},function(e){
			location.href="adminGoodList?method=searchGoods&&type="+type+"&content="+content+"&count="+count+"&ifonsale="+ifonsale+"&laber="+laber+"&priceDown="+priceDown+"&priceUp="+priceUp;

			});
	})
</script>
	</body>

</html>